<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
</head>
<body>
	<button id="startSession">开始会话</button>
	<button id="stopSession">结束会话</button>
	<button id="sendText">发送文字</button>
	<button id="startRecording">开始录音</button>
	<button id="stopRecording">停止录音</button>
	<script src="./index.js"></script>
	<script src="https://dev.g.alicdn.com/liveme-console/media-to-data/0.0.2/app.js"></script>
	<script>
		const client = new AvatarIM({
			url:'wss://pre-avatar-im.console.aliyun.com/ws',
			token:'327919',
			appId:'virtual-human-lab',
			tenant:'20000',
			sessionId: "7e86d753-03f3-49bb-a0a4-0e1110686541",
			onMessageCallback:(data) => {
				console.log('onMessageCallback-------',data)
			}
		})

		const mediaLib = new AvatarMedia({
				video: false,
				audio: true,
		});

		// getTracks().forEach
		let localStream;
		document.getElementById('startRecording').addEventListener('click',()=>{
			navigator.mediaDevices.getUserMedia({
				video: false,
				audio: true,
			}).then(function(stream) {
				localStream = stream;
				mediaLib.setStream(stream);
			})

			mediaLib.on('data', data => {
				const { audio } = data;
				const [format,base64] = audio.data.split(',');
				client.sessionReady.then(()=>{
					client.sendAudio({
						base64,
					});
				});
			})
		})
		
		document.getElementById('stopRecording').addEventListener('click',() => {
			mediaLib.destory();
			localStream.getTracks().forEach(track => {
				track.stop();
			})
		});

		document.getElementById('startSession').addEventListener('click',() => {
			client.startSession({dialogMode:"open",format:"wav"});
		});

		document.getElementById('stopSession').addEventListener('click',() => {
			client.stop();
		});

		document.getElementById('sendText').addEventListener('click',() => {
			client.sendText('你好呀');
		});

	</script>
</body>
</html>